<template>
  <div id="hotright">
    <div class="rbox1-user">
      <div class="user-top">
        <img src="@/assets/img/headicon.jpg" alt="头像">
<<<<<<< HEAD
        <span>{{ username }}</span>
=======
<<<<<<< HEAD
        <span>{{ username }}</span>
=======
        <span>用户5844370821055</span>
>>>>>>> 47b53261c8e91e7ca39280b9dc0f230d5a19dd33
>>>>>>> 36b4eaab32b312f7ed99e774a924af1f2e73a966
      </div>
      <ul class="user-bottom">
        <li><p>0</p><p>沸点</p></li>
        <li><p>0</p><p>圈子</p></li>
        <li><p>0</p><p>关注</p></li>
        <li><p>0</p><p>关注者</p></li>
      </ul>
    </div>
    <div class="right-img">
      <img src="@/assets/img/hotr/1.png" alt="">
    </div>
    <div class="right-img">
      <img src="@/assets/img/hotr/2.png" alt="">
    </div>
    <div class="right-img">
      <img src="@/assets/img/hotr/3.png" alt="">
    </div>
  </div>
</template>

<script>
export default {
<<<<<<< HEAD
=======
<<<<<<< HEAD
>>>>>>> 36b4eaab32b312f7ed99e774a924af1f2e73a966
  name: "hotRight",
  data() {
    return {
      username: this.$getSession() === null ? '游客' : this.$getSession().name
    }
  }
<<<<<<< HEAD
=======
=======
  name: "hotRight"
>>>>>>> 47b53261c8e91e7ca39280b9dc0f230d5a19dd33
>>>>>>> 36b4eaab32b312f7ed99e774a924af1f2e73a966
}
</script>

<style>
#hotright{
  width: 265px;
}
.rbox1-user{
  width: 225px;
  padding:20px;
  position: relative;
  background-color: #ffffff;
}
.user-top{
display: flex;
  align-items: center;
}
.user-top img{
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.user-top span{
  color: #252933;
  margin-left: 15px;
  font-size: 16px;
}
.user-bottom{
  display: flex;
}
.user-bottom::before{
  content: '';
  display: block;
  height: 1px;
  width: 90%;
  position: absolute;
  background-color: #E4E6EB;
  bottom: 80px;
  left: 5%;
}
.user-bottom li{
  margin-right: 20px;
  margin-top: 35px;
}
.user-bottom li p:first-child{
  margin-left: 5px;
}
.user-bottom li p:last-child{
  color: #8a919f;
  margin-top: 5px;
  font-size: 14px;
}
.right-img{
  width: 265px;
  margin-top: 15px;
}
.right-img img{
  width: 100%;
}
.right-img:last-child{
  margin-top: 5px;
}
</style>